<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>管理后台 - 我的博客</title>
    <link rel="stylesheet" href="assets/css/colors.css">
    <link rel="stylesheet" href="assets/css/layout.css">
    <link rel="stylesheet" href="assets/css/styles.css">
    <link rel="stylesheet" href="assets/css/pages/admin.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
</head>
<body>
    <div class="admin-container">
        <!-- 顶部栏 -->
        <header class="admin-header">
            <div class="header-search">
                <input type="text" placeholder="搜索...">
                <i class="fas fa-search"></i>
            </div>
            <div class="header-user">
                <span class="user-name">管理员</span>
                <img src="assets/images/avatar/default.jpg" alt="管理员头像" class="user-avatar">
                <div class="user-menu">
                    <a href="#profile">个人资料</a>
                    <a href="#logout">退出登录</a>
                </div>
            </div>
        </header>

        <!-- 主要内容区域 -->
        <div class="admin-main-container">
            <!-- 侧边栏 -->
            <aside class="admin-sidebar">
                <div class="admin-header">
                    <h1>博客管理</h1>
                </div>
                <nav class="admin-nav">
                    <ul>
                        <li class="active">
                            <a href="#dashboard">
                                <i class="fas fa-home"></i>
                                <span>仪表盘</span>
                            </a>
                        </li>
                        <li>
                            <a href="#posts">
                                <i class="fas fa-pen"></i>
                                <span>文章管理</span>
                            </a>
                        </li>
                        <li>
                            <a href="#albums">
                                <i class="fas fa-images"></i>
                                <span>相册管理</span>
                            </a>
                        </li>
                        <li>
                            <a href="#messages">
                                <i class="fas fa-comments"></i>
                                <span>留言管理</span>
                            </a>
                        </li>
                        <li>
                            <a href="#links">
                                <i class="fas fa-link"></i>
                                <span>友链管理</span>
                            </a>
                        </li>
                        <li>
                            <a href="#settings">
                                <i class="fas fa-cog"></i>
                                <span>网站设置</span>
                            </a>
                        </li>
                    </ul>
                </nav>
                <div class="admin-footer">
                    <a href="index.html" class="back-to-site">
                        <i class="fas fa-arrow-left"></i>
                        <span>返回网站</span>
                    </a>
                </div>
            </aside>

            <!-- 主内容区 -->
            <main class="admin-main">
                <!-- 内容区域 -->
                <div class="admin-content">
                    <!-- 仪表盘 -->
                    <section id="dashboard" class="content-section active">
                        <h2>仪表盘</h2>
                        <div class="stats-grid">
                            <div class="stat-card">
                                <i class="fas fa-file-alt"></i>
                                <div class="stat-info">
                                    <h3>文章数量</h3>
                                    <p>25</p>
                                </div>
                            </div>
                            <div class="stat-card">
                                <i class="fas fa-image"></i>
                                <div class="stat-info">
                                    <h3>相册数量</h3>
                                    <p>108</p>
                                </div>
                            </div>
                            <div class="stat-card">
                                <i class="fas fa-comment"></i>
                                <div class="stat-info">
                                    <h3>留言数量</h3>
                                    <p>56</p>
                                </div>
                            </div>
                            <div class="stat-card">
                                <i class="fas fa-eye"></i>
                                <div class="stat-info">
                                    <h3>访问量</h3>
                                    <p>1,234</p>
                                </div>
                            </div>
                        </div>

                        <div class="recent-activity">
                            <h3>最近活动</h3>
                            <div class="activity-list">
                                <div class="activity-item">
                                    <span class="activity-time">2024-03-15 14:30</span>
                                    <span class="activity-type">新留言</span>
                                    <span class="activity-content">用户"wangmiao"发表了新留言</span>
                                </div>
                                <div class="activity-item">
                                    <span class="activity-time">2024-03-15 13:45</span>
                                    <span class="activity-type">新文章</span>
                                    <span class="activity-content">发布了新文章《春天的记忆》</span>
                                </div>
                                <div class="activity-item">
                                    <span class="activity-time">2024-03-15 10:20</span>
                                    <span class="activity-type">相册更新</span>
                                    <span class="activity-content">上传了5张新照片到"2024年相册"</span>
                                </div>
                            </div>
                        </div>
                    </section>

                    <!-- 其他内容区域（默认隐藏） -->
                    <section id="posts" class="content-section">
                        <h2>文章管理</h2>
                        <!-- 文章管理内容 -->
                    </section>

                    <section id="albums" class="content-section">
                        <h2>相册管理</h2>
                        <!-- 相册管理内容 -->
                    </section>

                    <section id="messages" class="content-section">
                        <h2>留言管理</h2>
                        <!-- 留言管理内容 -->
                    </section>

                    <section id="links" class="content-section">
                        <h2>友链管理</h2>
                        <!-- 友链管理内容 -->
                    </section>

                    <section id="settings" class="content-section">
                        <h2>网站设置</h2>
                        <!-- 设置内容 -->
                    </section>
                </div>
            </main>
        </div>
    </div>

    <script src="assets/js/admin.js"></script>
</body>
</html> 